<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
	</head>
	<body>
        过滤器：对数据进行统一处理，得到一个统一规范的结果
        return 过滤器的新结果
        可以使用过滤器的是 {{}} 和 v-bind,其余的指令基本都不可以
		<div id="app">
           {{n|currency}}
           {{m|currency("$",3)}}
           {{msg|capitalize}}
           <h1 :title="msg|capitalize">111</h1>
		</div>

        <div class="appa">
           {{nn|currency}}
           {{mm|currency("$",3)}}
           {{msga|capitalize}}
        </div>

		<script>
           Vue.filter("capitalize",function(val){//全局过滤器
               let startNum=val.slice(0,1).toUpperCase();
               let endNum=val.slice(1);
               return startNum+endNum;
           })

            var vm=new Vue({
				el:"#app",
                data:{
                    n:100,
                    m:200,
                    msg:"hello"
                },
                filters:{//局部过滤器
                    currency(val,a='￥',b=2){
                        //val：过滤处理的数据
                        //a:过滤器函数调用传递的第一个参数
                        //b:过滤器函数调用传递的第二个参数
                        return a+val.toFixed(b)
                    }
                }
			})

            var vma=new Vue({
                el:".appa",
                data:{
                    nn:101,
                    mm:202,
                    msga:"world"
                }
            })
		</script>
	</body>
</html>
